$(document).ready(function () {


    layui.use(function () {

        var layer = layui.layer;
        var laydate = layui.laydate;

        laydate.render({
            elem: '#laydate-type-month',
            type: 'month'
            , value: new Date()
            , done: function (value, date, endDate) {
                queryMonthData()
            }
        });
        laydate.render({
            elem: '#laydate-type-year',
            type: 'year'
            , value: new Date()
            , done: function (value, date, endDate) {
                queryYearData()
            }
        });

        initSubMenu();

        queryMonthData()
        queryYearData()
        queryAllData()
    });
})



function queryMonthData() {

    new AjaxChain()
        .setUrl('/task/poweroff/countByMonth')
        .setData({
            month: $('#laydate-type-month').val(),
        })
        .then(data => {

            var xData = data.map(item => (item.day || 0))
            var yData = data.map(item => (item.count || 0))

            drawLine('countByMonth', xData, yData)
        })
        .send();
}

function queryYearData() {

    new AjaxChain()
        .setUrl('/task/poweroff/countByYear')
        .setData({
            year: $('#laydate-type-year').val(),
        })
        .then(data => {
            var xData = data.map(item => (item.month || 0))
            var yData = data.map(item => (item.count || 0))

            drawBar('countByYear', xData, yData)

        })
        .send();

}


function queryAllData() {

    new AjaxChain()
        .setUrl('/task/poweroff/countThreeYear')
        .then(data => {

            console.log();

            $(".chart-all").empty().append(
                `
                <div class="chart-all-item">
                    <div class="chart-circle">
                        <div>${Object.values(data)[2] || 0}</div>
                        <div>
                            <div>${Object.keys(data)[2]}年</div>
                            <div>报警总数</div>
                        </div>
                    </div>
                    <div class="chart-other">
                        <div><span>${Object.keys(data)[1]}年</span><span>${Object.values(data)[1] || 0}</span></div>
                        <div><span>${Object.keys(data)[0]}年</span><span>${Object.values(data)[0] || 0}</span></div>
                    </div>
                </div>
                `
            )


        })
        .send();

}



